<template>
    <div id="temp">
        <div class="stuInfo">
            <div class="tit">
                <span>教室详情</span>
                <span class="icon" @click="AddClassForm=true"></span>
            </div>
            <el-row>
                <el-col :span="7">
                    <div>
                        <el-col :span="10">
                            <span class="left">教室编号：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{ClassRoomData.number}}</span>
                        </el-col>
                    </div>
                    <div>
                        <el-col :span="10">
                            <span class="left">面积：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{ClassRoomData.acreage}}</span>
                        </el-col>
                    </div>
                </el-col>
                <el-col :span="7">
                    <div>
                        <el-col :span="10">
                            <span class="left">名称：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{ClassRoomData.name}}</span>
                        </el-col>
                    </div>
                    <div>
                        <el-col :span="10">
                            <span class="left">是否有模拟器：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{ClassRoomData.simulator}}</span>
                        </el-col>
                    </div>
                </el-col>
                <el-col :span="7">
                    <div>
                        <el-col :span="10">
                            <span class="left">容量：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{ClassRoomData.capacity}}</span>
                        </el-col>
                    </div>
                    <div>
                        <el-col :span="10">
                            <span class="left">教室类型：</span>
                        </el-col>
                        <el-col :span="14">
                            <span class="right">{{ClassRoomData.type}}</span>
                        </el-col>
                    </div>
                </el-col>
            </el-row>
        </div>
        <div class="record">
            <el-tabs type="border-card" @tab-click="formChange" :active-name="tabName">
                <el-tab-pane label="教学设备" name="teach">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th width="10%">
                                <span class="icon add" @click="OpenAddDevice()"></span>
                            </th>
                            <th width="5%">序号</th>
                            <th>资产编号</th>
                            <th>资产名称</th>
                            <th>规格型号</th>
                            <th>原值</th>
                            <th>数量</th>
                            <th>增加方式</th>
                            <th>累计折旧</th>
                            <th>月折旧</th>
                            <th>净值</th>
                            <th>启用时间</th>
                            <th>供应商名称</th>
                            <th>联系方式</th>
                            <th>负责人</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in list" :key="item.id">
                            <td>
                                <span class="icon edit" @click="EditDevice(item.id)"></span>
                                <span class="icon del" @click="DelDevice(item.id)"></span>
                            </td>
                            <td>{{index + 1}}</td>
                            <td>{{item.asset_num}}</td>
                            <td>{{item.asset_name}}</td>
                            <td>{{item.norms}}</td>
                            <td>{{item.cost}}</td>
                            <td>{{item.quantity}}</td>
                            <td>{{item.add_mode}}</td>
                            <td>{{item.accumulated_depreciation}}</td>
                            <td>{{item.monthly_depreciation}}</td>
                            <td>{{item.net_worth}}</td>
                            <td>{{item.use_date}}</td>
                            <td>{{item.supplier_name}}</td>
                            <td>{{item.contact_way}}</td>
                            <td>{{item.leading_official}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>
                <el-tab-pane label="办公设备" name="office">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th width="10%">
                                <span class="icon add" @click="OpenAddDevice()"></span>
                            </th>
                            <th width="5%">序号</th>
                            <th>资产编号</th>
                            <th>资产名称</th>
                            <th>规格型号</th>
                            <th>原值</th>
                            <th>数量</th>
                            <th>增加方式</th>
                            <th>累计折旧</th>
                            <th>月折旧</th>
                            <th>净值</th>
                            <th>启用时间</th>
                            <th>供应商名称</th>
                            <th>联系方式</th>
                            <th>负责人</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in list" :key="item.id">
                            <td>
                                <span class="icon edit" @click="EditDevice(item.id)"></span>
                                <span class="icon del" @click="DelDevice(item.id)"></span>
                            </td>
                            <td>{{index + 1}}</td>
                            <td>{{item.asset_num}}</td>
                            <td>{{item.asset_name}}</td>
                            <td>{{item.norms}}</td>
                            <td>{{item.cost}}</td>
                            <td>{{item.quantity}}</td>
                            <td>{{item.add_mode}}</td>
                            <td>{{item.accumulated_depreciation}}</td>
                            <td>{{item.monthly_depreciation}}</td>
                            <td>{{item.net_worth}}</td>
                            <td>{{item.use_date}}</td>
                            <td>{{item.supplier_name}}</td>
                            <td>{{item.contact_way}}</td>
                            <td>{{item.leading_official}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>
                <el-tab-pane label="办公家具" name="furniture">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th width="10%">
                                <span class="icon add" @click="OpenAddDevice()"></span>
                            </th>
                            <th width="5%">序号</th>
                            <th>资产编号</th>
                            <th>资产名称</th>
                            <th>规格型号</th>
                            <th>原值</th>
                            <th>数量</th>
                            <th>增加方式</th>
                            <th>累计折旧</th>
                            <th>月折旧</th>
                            <th>净值</th>
                            <th>启用时间</th>
                            <th>供应商名称</th>
                            <th>联系方式</th>
                            <th>负责人</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in list" :key="item.id">
                            <td>
                                <span class="icon edit" @click="EditDevice(item.id)"></span>
                                <span class="icon del" @click="DelDevice(item.id)"></span>
                            </td>
                            <td>{{index + 1}}</td>
                            <td>{{item.asset_num}}</td>
                            <td>{{item.asset_name}}</td>
                            <td>{{item.norms}}</td>
                            <td>{{item.cost}}</td>
                            <td>{{item.quantity}}</td>
                            <td>{{item.add_mode}}</td>
                            <td>{{item.accumulated_depreciation}}</td>
                            <td>{{item.monthly_depreciation}}</td>
                            <td>{{item.net_worth}}</td>
                            <td>{{item.use_date}}</td>
                            <td>{{item.supplier_name}}</td>
                            <td>{{item.contact_way}}</td>
                            <td>{{item.leading_official}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>
                <el-tab-pane label="维护保养记录" name="maintenance">
                    <el-tabs v-model="activeName" @tab-click="handleClick">
                        <el-tab-pane label="维修记录" name="maintenance">
                            <table class="tab-table">
                                <thead>
                                <tr>
                                    <th width="10%">
                                        <span class="icon add" @click="OpenMaintenance()"></span>
                                    </th>
                                    <th width="5%">序号</th>
                                    <th>资产编号</th>
                                    <th>资产名称</th>
                                    <th>故障发生时间</th>
                                    <th>故障现象</th>
                                    <th>维修状态</th>
                                    <th>故障解除时间</th>
                                    <th>金额</th>
                                    <th>负责人</th>
                                    <th>备注</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr v-for="(item,index) in list" :key="item.id">
                                    <td>
                                        <span class="icon edit" @click="EditMaintenance(item.id)"></span>
                                        <span class="icon del" @click="DelMaintenance(item.id)"></span>
                                    </td>
                                    <td>{{index + 1}}</td>
                                    <td>{{item.asset_num}}</td>
                                    <td>{{item.asset_name}}</td>
                                    <td>{{item.start_time}}</td>
                                    <td>{{item.phenomenon}}</td>
                                    <td>{{item.condition}}</td>
                                    <td>{{item.end_time}}</td>
                                    <td>{{item.money}}</td>
                                    <td>{{item.leading_official}}</td>
                                    <td>{{item.comments}}</td>
                                </tr>
                                </tbody>
                            </table>
                        </el-tab-pane>
                        <el-tab-pane label="保养记录" name="maintain">
                            <table class="tab-table">
                                <thead>
                                <tr>
                                    <th width="10%">
                                        <span class="icon add" @click="OpenMaintain()"></span>
                                    </th>
                                    <th width="5%">序号</th>
                                    <th>资产编号</th>
                                    <th>资产名称</th>
                                    <th>保养内容</th>
                                    <th>保养日期</th>
                                    <th>金额</th>
                                    <th>负责人</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr v-for="(item,index) in list" :key="item.id">
                                    <td>
                                        <span class="icon edit" @click="EditMaintain(item.id)"></span>
                                        <span class="icon del" @click="DelMaintain(item.id)"></span>
                                    </td>
                                    <td>{{index + 1}}</td>
                                    <td>{{item.asset_num}}</td>
                                    <td>{{item.asset_name}}</td>
                                    <td>{{item.content}}</td>
                                    <td>{{item.date}}</td>
                                    <td>{{item.money}}</td>
                                    <td>{{item.leading_official}}</td>
                                </tr>
                                </tbody>
                            </table>
                        </el-tab-pane>
                    </el-tabs>
                </el-tab-pane>
                <el-tab-pane label="出租记录" name="hire">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th>
                                <span class="icon add" @click="OpenHire()"></span>
                            </th>
                            <th>日期</th>
                            <th>小时数</th>
                            <th>事由</th>
                            <th>租用人</th>
                            <th>金额</th>
                            <th>备注</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="item in list" :key="item.id">
                            <td>
                                <span class="icon edit" @click="EditHire(item.id)"></span>
                                <span class="icon del" @click="DelHire(item.id)"></span>
                            </td>
                            <td>{{item.date}}</td>
                            <td>{{item.hourage}}</td>
                            <td>{{item.excuse}}</td>
                            <td>{{item.lessee}}</td>
                            <td>{{item.money}}</td>
                            <td>{{item.comments}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>
                <el-tab-pane label="空置成本" name="vacancy">
                  <table class="tab-table">
                    <thead>
                    <tr>
                      <th>
                        <span class="icon add" @click="OpenVacancy()"></span>
                      </th>
                      <th>月份</th>
                      <th>当月工作日</th>
                      <th>空置单价</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="item in list" :key="item.id">
                      <td>
                        <span class="icon edit" @click="EditVacancy(item.id)"></span>
                        <span class="icon del" @click="DelVacancy(item.id)"></span>
                      </td>
                      <td>{{item.month}}</td>
                      <td>{{item.workday}}</td>
                      <td>{{item.price}}</td>
                    </tr>
                    </tbody>
                  </table>
                </el-tab-pane>
                <el-tab-pane label="上传图片" name="photo">
                    <table class="tab-table">
                        <thead>
                        <tr>
                            <th>
                                <span class="icon add" @click="OpenPhoto"></span>
                            </th>
                            <th>缩略图</th>
                            <th>名称</th>
                            <th>上传日期</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="item in list" :key="item.id">
                            <td width="15%">
                                <span class="icon del" @click="DelPhoto(item.id)"></span>
                            </td>
                            <td width="30%"><img :src="item.path" height="50px"></td>
                            <td>{{item.name}}</td>
                            <td>{{item.date}}</td>
                        </tr>
                        </tbody>
                    </table>
                </el-tab-pane>
            </el-tabs>
        </div>
        <el-dialog title="编辑培训教室信息" :visible.sync="AddClassForm" size="tiny">
            <el-form :model="ClassRoomData" :label-width="width" :rules="ClassRoomRules" ref="ClassRoomRulesName">
                <el-form-item label="教室编号" prop="number">
                    <el-col :span="span">
                        <el-input v-model="ClassRoomData.number" size="small" placeholder="请输入教室编号"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="教室名称" prop="name">
                    <el-col :span="span">
                        <el-input v-model="ClassRoomData.name" size="small" placeholder="请输入教室名称"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="容量">
                    <el-col :span="span">
                        <el-input v-model="ClassRoomData.capacity" size="small" placeholder="请输入容量"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="面积">
                    <el-col :span="span">
                        <el-input v-model="ClassRoomData.acreage" size="small" placeholder="请输入面积"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="是否有模拟器">
                    <el-col :span="span">
                        <el-radio-group v-model="ClassRoomData.simulator" size="small">
                            <el-radio label="是"></el-radio>
                            <el-radio label="否"></el-radio>
                        </el-radio-group>
                    </el-col>
                </el-form-item>
                <el-form-item label="教室类型">
                    <el-col :span="span">
                        <el-select v-model="ClassRoomData.type" placeholder="请选择" size="small">
                            <el-option v-for="item in type" :label="item" :value="item" :key="item"></el-option>
                        </el-select>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="pop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeClassRoom()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加教学设备信息" :visible.sync="teachPop" size="tiny">
            <el-form :model="DeviceDatailDatas" :label-width="width" :rules="DeviceRules" ref="DeviceRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称" prop="asset_name">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_name" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="规格型号">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.norms" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="原值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.cost" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="数量">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.quantity" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="增加方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.add_mode" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="累计折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.accumulated_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="月折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.monthly_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="净值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.net_worth" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="启用时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="DeviceDatailDatas.use_date"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="供应商名称">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.supplier_name " size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="联系方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.contact_way" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="teachPop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeDevice()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加办公设备信息" :visible.sync="officePop" size="tiny">
            <el-form :model="DeviceDatailDatas" :label-width="width" :rules="DeviceRules" ref="DeviceRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称" prop="asset_name">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_name" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="规格型号">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.norms" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="原值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.cost" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="数量">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.quantity" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="增加方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.add_mode" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="累计折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.accumulated_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="月折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.monthly_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="净值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.net_worth" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="启用时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="DeviceDatailDatas.use_date"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="供应商名称">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.supplier_name " size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="联系方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.contact_way" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="officePop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeDevice()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加办公家具信息" :visible.sync="furniturePop" size="tiny">
            <el-form :model="DeviceDatailDatas" :label-width="width" :rules="DeviceRules" ref="DeviceRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称" prop="asset_name">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.asset_name" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="规格型号">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.norms" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="原值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.cost" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="数量">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.quantity" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="增加方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.add_mode" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="累计折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.accumulated_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="月折旧">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.monthly_depreciation" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="净值">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.net_worth" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="启用时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="DeviceDatailDatas.use_date"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="供应商名称">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.supplier_name " size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="联系方式">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.contact_way" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="DeviceDatailDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="furniturePop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeDevice()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加维修记录" :visible.sync="maintenancePop" size="tiny">
            <el-form :model="MaintenanceDatas" :label-width="width" :rules="MaintenanceRules"
                     ref="MaintenanceRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="选择资产名称" disabled></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称">
                    <el-col :span="span">
                        <el-select v-model="MaintenanceDatas.asset_num" placeholder="请选择">
                            <el-option v-for="item in asset" :label="item.asset_name" :value="item.asset_num"
                                       :key="item.asset_num"></el-option>
                        </el-select>
                    </el-col>
                </el-form-item>
                <el-form-item label="故障发生时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期"
                                        v-model="MaintenanceDatas.start_time" style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="故障现象">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.phenomenon" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="维修状态">
                    <el-col :span="span">
                        <el-select v-model="MaintenanceDatas.condition" placeholder="请选择">
                            <el-option v-for="item in options" :key="item" :label="item" :value="item">
                            </el-option>
                        </el-select>
                    </el-col>
                </el-form-item>
                <el-form-item label="故障解除时间">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="MaintenanceDatas.end_time"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="金额">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.money" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="备注">
                    <el-col :span="span">
                        <el-input v-model="MaintenanceDatas.comments" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="maintenancePop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeMaintenance()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加保养记录" :visible.sync="maintainPop" size="tiny">
            <el-form :model="MaintainDatas" :label-width="width" :rules="MaintenanceRules" ref="MaintainRulesName">
                <el-form-item label="资产编号" prop="asset_num">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.asset_num" size="small" auto-complete="off"
                                  placeholder="请选择资产名称" disabled></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="资产名称">
                    <el-col :span="span">
                        <el-select v-model="MaintainDatas.asset_num" placeholder="请选择">
                            <el-option v-for="item in asset" :label="item.asset_name" :value="item.asset_num"
                                       :key="item.asset_num"></el-option>
                        </el-select>
                    </el-col>
                </el-form-item>
                <el-form-item label="保养内容">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.content" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="保养日期">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="MaintainDatas.date"
                                        style="width: 100%;" auto-complete="off"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="金额">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.money" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="负责人">
                    <el-col :span="span">
                        <el-input v-model="MaintainDatas.leading_official" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="maintainPop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeMaintain()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加出租记录" :visible.sync="hirePop" size="tiny">
            <el-form :model="Hires" :label-width="width" :rules="HireRules" ref="HireRulesName">
                <el-form-item label="日期">
                    <el-col :span="span">
                        <el-date-picker type="date" size="small" placeholder="选择日期" v-model="Hires.date"
                                        style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="小时数">
                    <el-col :span="span">
                        <el-input v-model="Hires.hourage" size="small" auto-complete="off" placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="事由">
                    <el-col :span="span">
                        <el-input v-model="Hires.excuse" size="small" auto-complete="off" placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="租用人" prop="lessee">
                    <el-col :span="span">
                        <el-input v-model="Hires.lessee" size="small" auto-complete="off" placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="金额">
                    <el-col :span="span">
                        <el-input v-model="Hires.money" size="small" auto-complete="off" placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="备注">
                    <el-col :span="span">
                        <el-input v-model="Hires.comments" size="small" auto-complete="off"
                                  placeholder="请输入"></el-input>
                    </el-col>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="hirePop = false">取 消</el-button>
                <el-button type="primary" @click="ChangeHire()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog title="添加空置成本" :visible.sync="vacancyPop" size="tiny">
          <el-form :model="Vacancy" :label-width="width" :rules="VacancyRules" ref="VacancyRulesName">
            <el-form-item label="月份" prop="month">
              <el-col :span="span">
                <el-date-picker type="month" size="small" placeholder="选择月份" v-model="Vacancy.month"
                                style="width: 100%;"></el-date-picker>
              </el-col>
            </el-form-item>
            <el-form-item label="当月工作日" prop="workday">
              <el-col :span="span">
                <el-input v-model="Vacancy.workday" size="small"  placeholder="请输入当月工作日"></el-input>
              </el-col>
            </el-form-item>
            <el-form-item label="空置单价" prop="price">
              <el-col :span="span">
                <el-input v-model="Vacancy.price" size="small"  placeholder="请输入空置单价"></el-input>
              </el-col>
            </el-form-item>

          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="vacancyPop = false">取 消</el-button>
            <el-button type="primary" @click="ChangeVacancy()">确 定</el-button>
          </div>
        </el-dialog>
        <el-dialog title="上传图片" :visible.sync="dialogFormFile" size="tiny">
            <el-form :model="File" ref="File" label-width="80px">
                <el-form-item label="名称">
                    <el-input type="text" v-model="File.name"></el-input>
                </el-form-item>
                <el-form-item label="上传图片" prop="name">
                    <el-upload class="upload-demo" ref="upload" :action="fileAction" :on-change="fileUploadChange"
                               :file-list="fileList" :auto-upload="false" :on-success="fileUploadSuccess"
                               :on-remove="fileRemove" :data="uploadData">
                        <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                    </el-upload>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitFile()" :disabled="subDisabled">提 交</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
    import '../../../../assets/css/info.css'

    const DeviceDatailData = {
        asset_num: '',
        asset_name: '',
        norms: '',
        cost: '',
        quantity: '',
        add_mode: '',
        accumulated_depreciation: '',
        monthly_depreciation: '',
        net_worth: '',
        use_date: '',
        supplier_name: '',
        contact_way: '',
        leading_official: ''
    };
    const MaintenanceData = {
        start_time: '',
        phenomenon: '',
        condition: '',
        end_time: '',
        money: '',
        asset_num: '',
        asset_name: '',
        comments: '',
        leading_official: '',
        type: 'classroom'
    };
    const MaintainData = {
        asset_num: '',
        asset_name: '',
        content: '',
        date: '',
        money: '',
        leading_official: '',
        type: 'classroom'
    };
    const File = {
        name: '',
    };
    const Hire = {
        date: '',
        hourage: '',
        excuse: '',
        lessee: '',
        money: '',
        comments: ''
    };
    const Vacancy = {
      month: '',
      workday: '',
      price: '',
    };
    export default {
        data() {
            return {
                ClassRoomRules: {
                    name: [{required: true, message: '请填写名称', trigger: 'blur'}],
                    number: [{required: true, message: '请填写编号', trigger: 'blur'}]
                },
                DeviceRules: {
                    asset_name: [{required: true, message: '请填写名称', trigger: 'blur'}],
                    asset_num: [{required: true, message: '请填写编号', trigger: 'blur'}]
                },
                MaintenanceRules: {
                    asset_num: [{required: true, message: '请选择资产名称', trigger: 'blur,change'}]
                },
                HireRules: {
                    lessee: [{required: true, message: '请填写租用人', trigger: 'blur'}]
                },
                VacancyRules: {
                  month: [{type:'date',required: true, message: '请选择月份', trigger: 'blur,change'}],
                  workday: [{required: true, message: '请输入当月工作日', trigger: 'blur'}],
                  price: [{required: true, message: '请输入空置单价', trigger: 'blur'}],
                },


                AddClassForm: false,
                ClassRoomData: {
                    id: this.id,
                    number: '',
                    name: '',
                    capacity: '',
                    acreage: '',
                    simulator: '',
                    type: '',
                },

                type: ['自用', '外出', '外借'],
                tabLabel: '教学设备',
                activeName: 'maintenance',
                tabName: 'teach',
                id: '',
                list: {},
                asset: {},

                width: '150px',
                span: 18,

                teachPop: false,
                officePop: false,
                furniturePop: false,
                DeviceDatailDatas: _g.cloneJson(DeviceDatailData),

                options: ['代办', '完成'],
                maintenancePop: false,
                MaintenanceDatas: _g.cloneJson(MaintenanceData),

                maintainPop: false,
                MaintainDatas: _g.cloneJson(MaintainData),

                hirePop: false,
                Hires: _g.cloneJson(Hire),

                vacancyPop: false,
                Vacancy: _g.cloneJson(Vacancy),

                fileList: [],
                fileAction: PATH + 'Operation/classRoomPhotoAdd',
                dialogFormFile: false,
                uploadData: {
                    name: '',
                    pid: ''
                },
                File: _g.cloneJson(File),
                subDisabled: true,
            }
        },

        created() {
            this.id = this.$route.params.id;
            this.getClassRoomDetail();
            this.getDeviceData();
        },

        methods: {
            /* 窗口改变 */
            formChange(item) {
                this.tabLabel = item.label;
                this.tabName = item.name;
                if (item.name === 'teach' || item.name === 'office' || item.name === 'furniture') {
                    this.getDeviceData();
                } else if (item.name === 'maintenance') {
                    this.activeName = 'maintenance';
                    this.getmaintenance();
                } else if (item.name === 'hire') {
                    this.getHire();
                } else if(item.name === 'vacancy'){
                    this.getVacancy()
                }else {
                    this.getPhoto();
                }
            },
            handleClick(tab, event) {
                this.activeName = tab.name;
                eval('this.get' + tab.name + '()');
            },

            /* 获取数据 */
            getClassRoomDetail() {
                let data = {id: this.id};
                this.apiPost('Operation/classRoomDetail', data).then(res => {
                    this.ClassRoomData = res
                })
            },
            getDeviceData() {
                let data = {id: this.id, type: this.tabName};
                this.apiPost('Operation/classRoomDevice', data).then(res => {
                    this.list = res
                })
            },
            getmaintenance() {
                let data = {type: 'classroom'};
                this.apiPost('Operation/classRoomMaintenance', data).then(res => {
                    this.list = res
                })
            },
            getmaintain() {
                let data = {type: 'classroom'};
                this.apiPost('Operation/classRoomMaintain', data).then(res => {
                    this.list = res
                })
            },
            getAsset() {
                let data = {database: 'operate_classroom_device'};
                this.apiPost('System/getAsset', data).then(res => {
                    this.asset = res
                })
            },
            getHire() {
                let data = {cid: this.id};
                this.apiPost('Operation/classRoomHire', data).then(res => {
                    this.list = res
                })
            },
            getVacancy() {
              let data = {cid: this.id};
              this.apiPost('Operation/classRoomVacancy', data).then(res => {
                this.list = res
              })
            },
            getPhoto() {
                let data = {pid: this.id};
                this.apiPost('Operation/classRoomPhoto', data).then(res => {
                    this.list = res
                })
            },

            /* 编辑或者新增数据 */
            ChangeClassRoom() {
                this.$refs.ClassRoomRulesName.validate((valid) => {
                    if (valid) {
                        this.AddClassForm = false;
                        let data = this.ClassRoomData;
                        this.apiPost('Operation/classRoomEdit', data).then(res => {
                            let remind = res.error ? 'error' : 'success';
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getClassRoomDetail();
                            } else {
                                this.AddClassForm = true
                            }
                        })
                    } else {
                        return false;
                    }
                });
            },
            ChangeDevice() {
                this.$refs.DeviceRulesName.validate((valid) => {
                    if (valid) {
                        this[this.tabName + 'Pop'] = false;
                        let data = this.DeviceDatailDatas;
                        data.cid = this.id;
                        data.type = this.tabName;
                        this.apiPost('Operation/classRoomDeviceChange', data).then(res => {
                            let remind = res.error ? 'error' : 'success';
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getDeviceData();
                            } else {
                                this[this.tabName + 'Pop'] = true;
                            }
                        })
                    } else {
                        return false;
                    }
                });
            },
            ChangeMaintenance() {
                this.$refs.MaintenanceRulesName.validate((valid) => {
                    if (valid) {
                        this.getAsset();
                        this.maintenancePop = false;
                        let data = this.MaintenanceDatas;
                        data.type = 'classroom';
                        this.apiPost('Operation/classRoomMaintenanceEdit', data).then(res => {
                            let remind = res.error ? 'error' : 'success';
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getmaintenance();
                            } else {
                                this.maintenancePop = true;
                            }
                        })
                    } else {
                        return false;
                    }
                });
            },
            ChangeMaintain() {
                this.$refs.MaintainRulesName.validate((valid) => {
                    if (valid) {
                        this.getAsset();
                        this.maintainPop = false;
                        let data = this.MaintainDatas;
                        data.type = 'classroom';
                        this.apiPost('Operation/classRoomMaintainEdit', data).then(res => {
                            let remind = res.error ? 'error' : 'success';
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getmaintain();
                            } else {
                                this.maintainPop = true;
                            }
                        })
                    } else {
                        return false;
                    }
                });
            },
            ChangeHire() {
                this.$refs.HireRulesName.validate((valid) => {
                    if (valid) {
                        this.hirePop = false;
                        let data = this.Hires;
                        data.cid = this.id;
                        this.apiPost('Operation/classRoomHireEdit', data).then(res => {
                            let remind = res.error ? 'error' : 'success';
                            _g.toastMsg(remind, res.msg);
                            if (!res.error) {
                                this.getHire();
                            } else {
                                this.hirePop = true;
                            }
                        })
                    } else {
                        return false;
                    }
                });
            },
          ChangeVacancy() {
            this.$refs.VacancyRulesName.validate((valid) => {
              if (valid) {
                this.vacancyPop = false;
                let data = this.Vacancy;
                data.cid = this.id;
                this.apiPost('Operation/classRoomVacancyEdit', data).then(res => {
                  let remind = res.error ? 'error' : 'success';
                  _g.toastMsg(remind, res.msg);
                  if (!res.error) {
                    this.getVacancy();
                  } else {
                    this.vacancyPop = true;
                  }
                })
              } else {
                return false;
              }
            });
          },

            /* 打开编辑窗口 */
            EditDevice(id) {
                let data = {id: id};
                this.apiPost('Operation/classRoomDeviceDetail', data).then(res => {
                    setTimeout(() => {
                        this[this.tabName + 'Pop'] = true;
                        setTimeout(() => {
                            this.$refs.DeviceRulesName.resetFields();
                            this.DeviceDatailDatas = res;
                        }, 0);
                    }, 0);
                })
            },
            EditMaintenance(id) {
                let data = {id: id};
                this.apiPost('Operation/classRoomMaintenanceDetail', data).then(res => {
                    this.getAsset();
                    setTimeout(() => {
                        this.maintenancePop = true;
                        setTimeout(() => {
                            this.$refs.MaintenanceRulesName.resetFields();
                            this.MaintenanceDatas = res;
                        }, 0);
                    }, 0);
                })
            },
            EditMaintain(id) {
                let data = {id: id};
                this.apiPost('Operation/classRoomMaintainDetail', data).then(res => {
                    this.getAsset();
                    setTimeout(() => {
                        this.maintainPop = true;
                        setTimeout(() => {
                            this.$refs.MaintainRulesName.resetFields();
                            this.MaintainDatas = res;
                        }, 0);
                    }, 0);
                })
            },
            EditHire(id) {
                let data = {id: id};
                this.apiPost('Operation/classRoomHireDetail', data).then(res => {
                    setTimeout(() => {
                        this.hirePop = true;
                        setTimeout(() => {
                            this.$refs.HireRulesName.resetFields();
                            this.Hires = res;
                        }, 0);
                    }, 0);
                })
            },
          EditVacancy(id) {
            let data = {id: id};
            this.apiPost('Operation/classRoomVacancyDetail', data).then(res => {

                this.vacancyPop = true;
                setTimeout(() => {
                  this.$refs.VacancyRulesName.resetFields();
                  res.month = new Date(res.month.replace('/-/','/'))
                  this.Vacancy = res;
                }, 0);
            })
          },

            /* 删除 */
            DelDevice(id) {
                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let data = {id: id};
                    this.apiPost('Operation/classRoomDeviceDelete', data).then(res => {
                        if (!res.error) {
                            this.$message({
                                type: 'success',
                                message: res.msg
                            });
                        } else {
                            this.$message({
                                type: 'error',
                                message: res.msg
                            });
                        }
                        this.getDeviceData();
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            DelMaintenance(id) {
                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let data = {id: id};
                    this.apiPost('Operation/classRoomMaintenanceDelete', data).then(res => {
                        if (!res.error) {
                            this.$message({
                                type: 'success',
                                message: res.msg
                            });
                        } else {
                            this.$message({
                                type: 'error',
                                message: res.msg
                            });
                        }
                        this.getmaintenance();
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            DelMaintain(id) {
                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let data = {id: id};
                    this.apiPost('Operation/classRoomMaintainDelete', data).then(res => {
                        if (!res.error) {
                            this.$message({
                                type: 'success',
                                message: res.msg
                            });
                        } else {
                            this.$message({
                                type: 'error',
                                message: res.msg
                            });
                        }
                        this.getmaintain();
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            DelPhoto(id) {
                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let data = {id: id};
                    this.apiPost('Operation/classRoomPhotoDelete', data).then(res => {
                        if (!res.error) {
                            this.$message({
                                type: 'success',
                                message: res.msg
                            });
                        } else {
                            this.$message({
                                type: 'error',
                                message: res.msg
                            });
                        }
                        this.getPhoto();
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            DelHire(id) {
                this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let data = {id: id};
                    this.apiPost('Operation/classRoomHireDelete', data).then(res => {
                        if (!res.error) {
                            this.$message({
                                type: 'success',
                                message: res.msg
                            });
                        } else {
                            this.$message({
                                type: 'error',
                                message: res.msg
                            });
                        }
                        this.getHire();
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
          DelVacancy(id) {
            this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              let data = {id: id};
              this.apiPost('Operation/classRoomVacancyDelete', data).then(res => {
                if (!res.error) {
                  this.$message({
                    type: 'success',
                    message: res.msg
                  });
                } else {
                  this.$message({
                    type: 'error',
                    message: res.msg
                  });
                }
                this.getVacancy();
              });
            }).catch(() => {

            });
          },

            /* 打开新增窗口 */
            OpenAddDevice() {
                this.DeviceDatailDatas = _g.cloneJson(DeviceDatailData);
                this[this.tabName + 'Pop'] = true;
                this.$refs.DeviceRulesName.resetFields();
            },
            OpenMaintenance() {
                this.getAsset();
                this.MaintenanceDatas = _g.cloneJson(MaintenanceData);
                this.maintenancePop = true;
                this.$refs.MaintenanceRulesName.resetFields();
            },
            OpenMaintain() {
                this.getAsset();
                this.MaintainDatas = _g.cloneJson(MaintainData);
                this.maintainPop = true;
                this.$refs.MaintainRulesName.resetFields();
            },
            OpenPhoto() {
                this.File = _g.cloneJson(File);
                this.fileList = [];
                this.dialogFormFile = true;
            },
            OpenHire() {
                this.Hires = _g.cloneJson(Hire);
                this.hirePop = true;
                this.$refs.HireRulesName.resetFields();
            },
          OpenVacancy() {
            this.Vacancy = _g.cloneJson(Vacancy);
            this.vacancyPop = true;
            setTimeout(() => {
              this.$refs.VacancyRulesName.resetFields();
            }, 0);

          },

            /* 图片上传 */
            fileUploadChange(file, fileList) {
                if (fileList.length > 1) {
                    _g.toastMsg('warning', '每次限上传一个文件')
                }
                this.subDisabled = fileList.length == 1 ? false : true
            },
            fileRemove(file, fileList) {
                this.subDisabled = fileList.length == 1 ? false : true
            },
            fileUploadSuccess(res) {
                _g.closeGlobalLoading();
                let remind = res.error ? 'error' : 'success';
                _g.toastMsg(remind, res.msg);
                if (!res.error) {
                    this.dialogFormFile = false;
                    this.getPhoto();
                }

            },
            submitFile() {
                this.uploadData.name = this.File.name;
                this.uploadData.pid = this.id;
                setTimeout(() => {
                    this.$refs.upload.submit()
                }, 0)
            },

        },
    }
</script>

<style scoped>
    .headPic {
        padding: 0;
    }

    .headPic img {
        margin-left: 50px;
        width: 50%;
    }

    .add {
        width: 25px;
        height: 25px;
    }

    .stuInfo {
        margin-bottom: 20px;
    }
</style>
